<div class="modal-header">
    <h3 class="modal-title">
        <b style="color: #286090">{{username}}</b>
        的授权服务器组列表
    </h3>
</div>
<div class="modal-body">
    <form class="form-horizontal">
        <div class="form-group">
            <label class="col-lg-2 control-label"><span style="color: #ec2121;">*</span>服务器组</label>
            <div class="col-lg-5">
                <ui-select ng-model="nowServerGroup.selected" theme="bootstrap">
                    <ui-select-match placeholder="搜索服务器组名称......">{{$select.selected.name}}</ui-select-match>
                    <ui-select-choices refresh="queryServerGroup($select.search)" refresh-dalay="0"
                                       repeat="item in serverGroupList | filter: $select.search">
                        <div ng-bind-html="item.name | highlight: $select.search"></div>
                    </ui-select-choices>
                </ui-select>
            </div>
            <div class="col-lg-3" ng-show="false">
                <label>
                    <input type="checkbox" ng-model="item.choose"><b>同时添加持续集成权限</b>
                </label>
            </div>
            <div class="col-lg-2">

                <button ng-click="addItem(item.choose)"
                        class="btn btn-xs"
                        uib-popover-html="'可勾选添加持续集成权限'" popover-trigger="'mouseenter'"
                        style="background-color: #2e6da4; color: white;">
                    <span class="glyphicon glyphicon-plus"></span>添加
                </button>

                <!--<span  class="glyphicon glyphicon-plus"-->
                <!--uib-popover-html="'添加'" popover-trigger="'mouseenter'"-->
                <!--ng-click="addItem(item.choose)"></span>-->
            </div>
        </div>
    </form>

    <div style="margin-top: 5px;">
        <table class="table table-hover table-bordered table-striped">
            <thead>
            <tr>
                <td>服务器组</td>
                <td class="col-md-3">告警配置</td>
                <td class="col-md-2">操作</td>
            </tr>
            </thead>
            <tbody>
            <tr ng-repeat="item in pageData">
                <td>
                    <b style="color: #286090">{{item.serverGroupDO.name}}</b>
                    <!--<b class="pull-right" style="color: #777">组</b>-->
                    </br>
                    <!--服务器描述-->
                    <b style="color: #777">{{item.serverGroupDO.content}}</b>
                </td>
                <td>
                    <b style="color: #449d44" ng-if="item.zabbixUsergroup == 1">正常</b>
                    <span style="color: #777" ng-if="item.zabbixUsergroup == 2">未创建用户</span>
                    <span style="color: #777" ng-if="item.zabbixUsergroup == 3">未创建用户组</span>
                </td>
                <td>
                    <button ng-click="delItem(item.serverGroupDO.id)"
                            class="btn btn-xs pull-right"
                            uib-popover-html="'解除授权'" popover-trigger="'mouseenter'"
                            style="background-color: red; color: white;">
                        <span class="glyphicon glyphicon-log-out"></span>解除
                    </button>

                    <!--<span class="glyphicon glyphicon-log-out pull-right"-->
                    <!--style="color: #d9534f"-->
                    <!--uib-popover-html="'解除授权'" popover-trigger="'mouseenter'"-->
                    <!--ng-click="delItem(item.serverGroupDO.id)">-->
                    <!--</span>-->
                </td>
            </tr>
            </tbody>
            <tfoot>
            <tr>
                <td colspan="4">
                    <ul style="margin: 0px; float: right;" uib-pagination total-items="totalItems"
                        ng-model="currentPage" items-per-page="pageLength" max-size="10"
                        ng-change="pageChanged(currentPage)" previous-text="&lsaquo;" next-text="&rsaquo;"></ul>
                </td>
            </tr>
            </tfoot>
        </table>
    </div>

    <div class="form-group" style="text-align:center;">

        <button ng-click="closeModal()"
                class="btn btn-xs"
                style="margin-left: 20px; background-color: #d78700; color: white;">
            <span class="glyphicon glyphicon-remove"></span>关闭
        </button>


    </div>

    <div ng-if="alert.type != ''">
        <div uib-alert ng-class="'alert-' + alert.type" close="closeAlert()">{{alert.msg}}</div>
    </div>
</div>